<script setup lang="ts">
import {
  ManagedFieldEntity,
  NodeInfo,
  Pod,
  Taint
} from "@/views/domain/kubeHud/api/k8s/types";
import { onMounted, ref } from "vue";
import nodeProvider from "./nodeProvider";
import { timeTrans } from "@/views/domain/kubeHud/utils";
import { useRoute } from "vue-router";
import InTagLine from "@/views/domain/kubeHud/views/k8s/components/InTagLine.vue";
import KDescGroup from "@/views/domain/kubeHud/views/k8s/components/KDescGroup.vue";
import KDescRow from "@/views/domain/kubeHud/views/k8s/components/KDescRow.vue";
import NodeCondition from "@/views/domain/kubeHud/views/k8s/node/widgets/NodeCondition.vue";
import KPodList from "../pod/widgets/KPodList.vue";

type Prop = {
  name?: string;
};

const props = defineProps<Prop>();
const route = useRoute();

const { nodeApi, loading, isNodeReady } = nodeProvider;

const currentNode = ref<NodeInfo>();

const getCurrentNodeInfo = async (name?: string) => {
  loading.value = true;
  const res = await nodeApi.getNodeDetail({ name });
  if (res.ok) {
    currentNode.value = res.data;
  }

  loading.value = false;
};
onMounted(() => {
  if (props.name) {
    getCurrentNodeInfo(props.name);
  } else if (route.query.name) {
    getCurrentNodeInfo(route.query.name as string);
  }
});
</script>

<template>
  <div v-if="currentNode" v-loading="loading" class="node-details-wrapper">
    <KDescGroup title="基本信息">
      <KDescRow label="名称" :content="currentNode.metadata.name" />
      <KDescRow label="状态">
        <el-tag :type="isNodeReady(currentNode) ? 'success' : 'danger'">
          {{ isNodeReady(currentNode) ? "Ready" : "NotReady" }}
        </el-tag>
      </KDescRow>

      <KDescRow
        label="创建时间"
        :content="
          timeTrans(
            currentNode?.metadata?.creationTimestamp,
            'YYYY-MM-DD HH:mm:ss'
          )
        "
      />
      <KDescRow label="标签">
        <el-space wrap>
          <InTagLine
            v-for="(item, key) in currentNode.metadata.labels"
            :key="key"
            :title="`${key}`"
            :content="item"
          />
        </el-space>
      </KDescRow>
      <KDescRow label="注解">
        <el-space wrap direction="vertical" alignment="start">
          <InTagLine
            v-for="(item, key) in currentNode.metadata.annotations"
            :key="key"
            type="info"
            :title="`${key}`"
            :content="item"
          />
        </el-space>
      </KDescRow>
      <KDescRow label="污点">
        <el-space
          v-if="currentNode.spec?.taints && currentNode.spec.taints.length > 0"
          wrap
          direction="vertical"
          alignment="start"
        >
          <InTagLine
            v-for="taint in currentNode.spec?.taints"
            :key="taint.key"
            :title="taint.key"
            :content="taint.value"
          />
        </el-space>
        <el-empty v-else :image-size="30" style="--el-empty-padding: none" />
      </KDescRow>
      <KDescRow label="网络">
        <el-space direction="vertical" alignment="start">
          <in-tag-line
            v-for="address in currentNode.status?.addresses"
            :key="address.type"
            :title="address.type"
            :content="address.address"
          />
        </el-space>
      </KDescRow>
    </KDescGroup>

    <k-desc-group title="系统信息">
      <k-desc-row
        label="CPU架构"
        :content="currentNode.status?.nodeInfo?.architecture"
      />
      <k-desc-row
        label="BootID"
        :content="currentNode.status?.nodeInfo?.bootID"
      />
      <k-desc-row
        label="系统UUID"
        :content="currentNode.status?.nodeInfo?.systemUUID"
      />
      <k-desc-row
        label="操作系统"
        :content="currentNode.status?.nodeInfo?.operatingSystem"
      />
      <k-desc-row
        label="系统镜像"
        :content="currentNode.status?.nodeInfo?.osImage"
      />
      <k-desc-row
        label="内核版本"
        :content="currentNode.status?.nodeInfo?.kernelVersion"
      />
      <k-desc-row
        label="Kubelet版本"
        :content="currentNode.status?.nodeInfo?.kubeletVersion"
      />
      <k-desc-row
        label="容器运行时"
        :content="currentNode.status?.nodeInfo?.containerRuntimeVersion"
      />
      <k-desc-row
        label="Kubelet版本"
        :content="currentNode?.status?.nodeInfo?.kubeletVersion"
      />
    </k-desc-group>

    <k-desc-group title="运行状态">
      <node-condition :node-info="currentNode" />
    </k-desc-group>
    <k-desc-group title="Pods">
      <k-pod-list :node-name="currentNode.metadata.name" />
    </k-desc-group>
  </div>
  <div v-else v-loading="true" />
</template>
<style lang="scss" scoped>
.node-details-wrapper {
  background-color: var(--el-bg-color);
}

.description-wrapper {
  display: flex;
  flex-direction: column;
  // padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--el-border-color);

  .description-row {
    display: flex;
    align-items: center;
    gap: 10px;
    align-items: start;
    padding: 10px;
    border-bottom: 1px solid var(--el-border-color);

    .description-label {
      font-size: var(--el-font-size-base);
      width: 40%;
    }

    .description-value {
      padding-left: 10px;
      border-left: 1px solid var(--el-border-color);
      font-size: 14px;
      flex: 1;
    }
  }
  :last-child {
    border-bottom: none;
  }
}
</style>
